<template>
  <div class="main-container-app">
  <el-row class="form-contain" >
    <fin-detail-form  @handleQueryFinDetail="handleQueryFinDetail"></fin-detail-form>
  </el-row>
    <div class="table-contain">
    <fin-detail-table :searchList="finDetailRes" :listLoadingFinDetail="loading"
                      @handleSizeChangeFinDetail="handleSizeChangeFinDetail"
                      @handleCurrentChangeFinDetail="handleCurrentChangeFinDetail"></fin-detail-table>
    </div>
  </div>
</template>

<script>
  /* eslint-disable */
  import FinDetailForm from "./finDetailSearchChild/finDetailForm";
  import FinDetailTable from "./finDetailSearchChild/finDetailTable";
  import {fetchListFinDetail} from "../../api/trademag/finDetail";
  import {selDictonaryValue} from "../../api/dictionary";

  export default {
    components: {
      FinDetailTable,
      FinDetailForm},
    data() {
      return {
        finDetailRes: [],
        loading: false,
        queryDataFinDetail: {
          rangeTime:[new Date(),new Date()],
        },
        listQuery: {
          page: 1,
          limit: 20
        }
      }
    },
    methods:{
      handleQueryFinDetail(val){
        this.queryDataFinDetail=val
        this.listQuery.page=1
        this.listQuery.limit=20
        this.getDataListFinDetail()
      },
      handleCurrentChangeFinDetail(val) {
        this.listQuery.page = val
        this.getDataListFinDetail()
      },
      handleSizeChangeFinDetail(val) {
        this.listQuery.limit = val
        this.listQuery.page = 1
        this.getDataListFinDetail()
      },
      getDataListFinDetail() {
        this.loading = true
        fetchListFinDetail(this.listQuery, this.queryDataFinDetail).then(res => {
          selDictonaryValue(res).then(response=>{
            this.finDetailRes = response
            this.loading = false
          })

        }),
          (err)=>{
            this.loading = false
          }
      }
    }
  }
</script>

<style scoped>

</style>
